<template>

   <div>
       <h1 align="center">登录</h1>
        <el-form :model="form" label-width="4rem">
          <el-form-item label="用户名:">
              <el-input v-model="form.username" placeholder="请输入用户名"></el-input>
          </el-form-item>
          <el-form-item label="密码:">
              <el-input v-model="form.password" placeholder="请输入密码" show-password></el-input>
          </el-form-item>
          <el-form-item label="">
              <el-button type="primary" @click="login">登录</el-button>
          </el-form-item>
        </el-form>
   </div>

</template>

<script>

import {postLogin} from '@/http/api.js'

export default {
   data(){
       return {
          form:{}
       }
   },
   methods:{
       login(){
           postLogin(this.form)
           .then(resp=>{
               console.log(resp)
               alert(resp.data.msg)
               if(resp.data.code==200){
                   //成功，进行状态保持
                   sessionStorage.setItem("token",resp.data.token)
                   sessionStorage.setItem("username",this.form.username)
                   this.$router.push("/")
               }
           }).catch(error=>{
               console.log(error)
           })
       }
   },
   created(){

   }
}
</script>

<style>
.el-form{
    width:500px;
    margin:50px auto;
}
</style>